<!DOCTYPE html>
<html lang="zh-CN">

  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>配置管理系统</title>

    <!-- Bootstrap -->
    <link rel="stylesheet" type="text/css" href="dist/bootstrap-3.3.7/css/bootstrap.css"/>
    <!--<link rel="stylesheet" type="text/css" href="dist/DataTables-1.10.16/datatables.css"/>-->
    <!--<link rel="stylesheet" type="text/css" href="dist/DataTables-1.10.16/DataTables-1.10.16/css/dataTables.bootstrap.css/"/>-->
    <link rel="stylesheet" type="text/css" href="dist/DateTimePicker/bootstrap-datetimepicker.css"/>
    <link rel="stylesheet" type="text/css" href="dist/bootstrap-select-1.12.4/css/bootstrap-select.css"/>
    <link rel="stylesheet" type="text/css" href="dist/x-editable/bootstrap-editable.css"/>
    <!--<link rel="stylesheet" type="text/css" href="dist/Swiper/css/swiper.css"/>-->
    <link rel="stylesheet" type="text/css" href="css/basic.css"/>
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
    
	  <link href="https://cdn.bootcss.com/video.js/7.0.3/video-js.min.css" rel="stylesheet">

    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
    <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>
    <header>
      <div class="logo"></div>
      <div class="quit">退出</div>
      <div class="text">您好！管理员</div>
    </header>
    
    <div class="leftNav">
      <!-- Nav tabs -->
      <ul class="nav nav-tabs nav-stacked" role="tablist">
        <li role="presentation" class="active">
          <a href=".home" aria-controls="home" role="tab" data-toggle="tab">首页</a>
        </li>
        <li role="presentation">
          <a href=".control" aria-controls="control" role="tab" data-toggle="tab">实时监控</a>
        </li>
        <li role="presentation">
          <a href=".monitor" aria-controls="monitor" role="tab" data-toggle="tab">监测预警</a>
        </li>
        <li role="presentation">
          <a href=".settings" aria-controls="settings" role="tab" data-toggle="tab">配置管理</a>
        </li>
        <li role="presentation">
          <a href=".permission" aria-controls="permission" role="tab" data-toggle="tab">权限管理</a>
        </li>
        <li role="presentation">
          <a href=".appointment" aria-controls="appointment" role="tab" data-toggle="tab">预约管理</a>
        </li>
        <li role="presentation">
          <a href=".count" aria-controls="count" role="tab" data-toggle="tab">统计分析</a>
        </li>
      </ul>
    </div>
    <!-- Tab panes -->
    <div class="tab-content main">
      <!--首页-->
      <div role="tabpanel" class="tab-pane home active">
      	<div class="top" id="homeZoom">
      		<canvas id="robotPosition"></canvas>
      	</div>
      	<div class="bottom">
          <!-- Nav tabs -->
      		<ul class="nav nav-tabs" role="tablist">
      			<li role="presentation" class="active">
      				<a href=".homeRobot" aria-controls="home" role="tab" data-toggle="tab">机器人图示</a>
      			</li>
      			<li role="presentation">
      				<a href=".homeOther" aria-controls="control" role="tab" data-toggle="tab">其他</a>
      			</li>
      		</ul>
      		<div class="tab-content">
      			<div role="tabpanel" class="tab-pane homeRobot active">
      				<div>
      					<div>机器人开启状态</div>
      					<div></div>
      					<div>机器人001</div>
      				</div>
      				<div>
      					<div>机器人充电状态</div>
      					<div></div>
      					<div>机器人001</div>
      				</div>
      				<div>
      					<div>机器人关闭状态</div>
      					<div></div>
      					<div>机器人001</div>
      				</div>
      			</div>
      			<div role="tabpanel" class="tab-pane homeOther">
      				<div>
      					<div>机器人充电位</div>
      					<div></div>
      				</div>
      				<div>
      					<div>机器人迎宾位</div>
      					<div></div>
      				</div>
      				<div>
      					<div>机器人送客位</div>
      					<div></div>
      				</div>
      				<div>
      					<div>机器人讲解位</div>
      					<div></div>
      				</div>
      			</div>
      		</div>
        </div>
      </div>
      <!--实时监控-->
      <div role="tabpanel" class="control tab-pane">
        <div class="top">
          <div class="left">
            <div class="btns">
              <select id="" class="selectpicker show-tick form-control pickRobot">
                <!-- <option>机器人001A</option>
                <option>机器人002B</option>
                <option>机器人003C</option> -->
              </select>
            </div>
            <div class="direction">
              <div class="forward square"></div>
              <div class="back square"></div>
              <div class="left square"></div>
              <div class="right square"></div>
              <div class="play circle"></div>
              <div class="pause circle" style="display: none;"></div>
            </div>
            <div class="btns">
              <div class="btns change">
                <button type="button" class="btn btn-blue form-control" id="camera">开启前置摄像头</button>
                <button type="button" class="btn btn-orange form-control" style="display: none;">关闭前置摄像头</button>
              </div>
              <div class="btns voice">
                <button type="button" class="btn btn-orange form-control">切换后台语音</button>
              </div>
              <div class="sel">
                <select class="selectpicker show-tick form-control moveArea pickAppoint">
                  <!-- <option >AAA区</option>
                  <option selected>BBB区</option>
                  <option>CCC区</option> -->
                </select>
                <select class="selectpicker show-tick form-control pickTask">
                  <!-- <option>AAA区</option>
                  <option>BBB区</option>
                  <option>CCC区</option> -->
                </select>
                <button type="button" class="btn btn-gray turn-task">跳转任务</button>
              </div>
            </div>
          </div>
          <div class="right">
            <div class="btns">
              <div class="changeBtn videoChange">
                <button type="button" class="btn videoBtn">摄像头监控视频</button>
                <button type="button" class="btn expositoryBtn"  style="display: none;">机器人讲解视频</button>
              </div>
              <div class="changeBtn thumbChange">
                <button type="button" class="btn openThumb" style="display: none;">打开机器人位置地图</button>
                <button type="button" class="btn closeThumb">关闭机器人位置地图</button>
              </div>
            </div>
            <div class="pics">
              <!--机器人位置地图-->
              <div class="thumb thumbPic">
                <div id="plan-box" style="position: relative;overflow: hidden;">
                    <img src="img/u88.png" id="icon-robot" class="icon-robot" style="position:absolute;left:0;top:0;z-index:2;margin-left: -10px;margin-right:-8px;">
                    <img src="img/floor2.jpg" id="plan" style="width:100%;" />
                </div>
              </div>
              <!--摄像头监控视频-->
              <div class="video videoPic" style="display: none;">
                  <video id="robotVideo" class="video-js" height="100%" width="100%" controls preload="auto">
                  </video>
              </div>
              <!--机器人讲解视频-->
              <div class="expository expositoryPic" style="display: none;">
                <div>
                  <div>
                    <div class="txt">
                      <div class="title">机器人讲解内容</div>
                      <div class="content"></div>
                    </div>
                    <div class="pic">
                      <img src="img/robot.png" />
                    </div>
                  </div>
                </div>
                <!-- <video controls class="video-js" height="100%;" width="100%;" data-setup="{}">
                  你的浏览器不支持 <code>video</code> 标签.
                    <source src="http://192.168.206.98:9000/hls/1/index.m3u8" type="application/x-mpegURL">
                </video> -->
              </div>
            </div>
          </div>
        </div>
        <div class="bottom">
          <div class="txtMarquee-top">
            <div class="hd">
              <div class="left" style="cursor:pointer;">当前执行命令</div>
              <div class="right" style="cursor:pointer;">接待人员信息</div>
            </div>
            <div class="bd bd-left">
              当前执行命令
            </div>
            <div class="bd bd-right" style="display: none;">
              接待人员信息
            </div>
          </div>
          <div class="tableDiv">
            <table class="table table-striped controlTable table-bordered">
              <thead>
                <tr>
                  <td>序号</td>
                  <td>执行命令</td>
                  <td>命令</td>
                  <td>位置(区域、展板)</td>
                  <td>结果</td>
                  <td>返回值</td>
                </tr>
              </thead>
              <tbody></tbody>
            </table>
            <div class="more" style="float:right;cursor: pointer;">显示更多&gt;&gt;</div>
          </div>
        </div>
      </div>
      <!--监测预警begin-->
      <div role="tabpanel" class="monitor tab-pane">
        <div class="sel">
          <div class="dropdown robot">
            <select id="" class="selectpicker show-tick form-control pickRobot">
              <!-- <option value="1">AAA区</option>
              <option value="2">BBB区</option>
              <option value="3">CCC区</option> -->
            </select>
          </div>
          <input type="text" value="选择开始时间" class="datetimepicker now" id="monitorStartTime"/>
          <input type="text" value="选择结束时间" class="datetimepicker now" id="monitorEndTime"/>
          <div class="dropdown notifier">
            <select class="selectpicker show-tick form-control pickNotifier">
              <!-- <option>闪电侠</option>
              <option>绿箭侠</option>
              <option>钢铁侠</option> -->
            </select>
          </div>
          <div class="button">
            <button class="btn btn-default" type="submit">筛选</button>
          </div>
          <div class="dropdown right">
            <select class="selectpicker show-tick form-control pickSort">
              <option value="1">按照预警时间正向排序</option>
              <option value="2">按照预警时间反向排序</option>
              <option value="3">按照处理时间正向排序</option>
              <option value="4">按照处理时间反向排序</option>
            </select>
          </div>
        </div>
        <div class="table-responsive">
        	<div class="table">
        		<table class="table table-bordered table-striped tableMonitor">
        			<thead>
        				<tr>
        					<th>序号</th>
        					<th>机器人名称</th>
        					<th>预警时间</th>
        					<th>通知人</th>
        					<th>处理时间</th>
        					<th>处理结果记录</th>
        				</tr>
        			</thead>
        			<tbody></tbody>
        		</table>
        	</div>
        	<div class="page">
        		<ul class="pagination"></ul>
        	</div>
        </div>
      </div>
      <!--监测预警end-->
      <!--配置管理begin-->
      <div role="tabpanel" class="settings tab-pane">
        <div class="choose">
          <form class="form-horizontal" role="form">
            <div class="form-group">
              <!--<label for="" class="control-label">机器人配置信息</label>-->
              <div class="dropdown setting-pickRobot">
                <select class="selectpicker show-tick form-control pickRobot">
                  <option>AAA区</option>
                  <option>BBB区</option>
                  <option>CCC区</option>
                </select>
              </div>
            </div>
          </form>
        </div>
        <div class="tab">
          <!-- Nav tabs -->
          <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active">
              <a href=".systemConfiguration" aria-controls="systemConfiguration" role="tab" data-toggle="tab">系统配置</a>
            </li>
            <li role="presentation">
              <a href=".work " aria-controls="work" role="tab" data-toggle="tab">业务配置</a>
            </li>
            <li role="presentation">
              <a href=".ad" aria-controls="ad" role="tab" data-toggle="tab">广告配置</a>
            </li>
            <li role="presentation">
              <a href=".other" aria-controls="other" role="tab" data-toggle="tab">日志、维修、告警配置</a>
            </li>
          </ul>
          <!-- Tab panes -->
          <div class="tab-content">
            <!--配置管理→系统配置begin-->
            <div role="tabpanel" class="tab-pane active systemConfiguration tab2" id="systemConfiguration">
              <div class="tab systemTab" id="systemTab">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                  <li role="presentation" class="active">
                    <a href=".personCharge" aria-controls="personCharge" role="tab" data-toggle="tab">机器人负责人配置</a>
                  </li>
                  <li role="presentation">
                    <a href=".imageLibrary" aria-controls="imageLibrary" role="tab" data-toggle="tab">机器人形象库</a>
                  </li>
                  <li role="presentation">
                    <a href=".venueMap" aria-controls="venueMap" role="tab" data-toggle="tab">场馆地图库</a>
                  </li>
                  <li role="presentation">
                    <a href=".electricLow" aria-controls="electricLow" role="tab" data-toggle="tab">机器人最低电量</a>
                  </li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                  <!--配置管理→系统配置→机器人负责人配置-->
                  <div role="tabpanel" class="tab-pane active personCharge">
                    <div class="sel">
                      <button class="btn btn-blue" type="submit">添加负责人</button>
                      <div class="form-inline" style="display: none;">
                        <input type="text" class="form-control" placeholder="姓名" id="pz_name">
                        <input type="tel" class="form-control" placeholder="电话" id="pz_phone">
                        <input type="email" class="form-control" placeholder="邮件" id="pz_email">
                        <button class="btn btn-default confirm" type="submit">确定添加</button>
                      </div>
                    </div>
                    <div class="tableDiv">
                      <table id="tablePersonCharge_set" class="table table-bordered table-responsive tablePersonCharge tablePersonCharge_set" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>姓名</td>
                            <td>电话</td>
                            <td>邮件</td>
                            <td>权限</td>
                            <td>编辑</td>
                            <td>删除</td>
                            <td>选择</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="button">
                        <button class="btn btn-default" type="submit" id="deleteMore">删除</button>
                        <button class="btn btn-blue" type="submit" id="saveMore" style="background-color: #3497DB;">保存</button>
                      </div>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <!--配置管理→系统配置→机器人形象库-->
                  <div role="tabpanel" class="tab-pane imageLibrary scroll">
                    <div class="title">选择机器人形象</div>
                    <div class="picScroll-left imageSlide">
                      <a class="prev"></a>
                      <a class="next"></a>
                      <div class="bd">
                        <ul class="picList"></ul>
                      </div>
                    </div>
                    <div class="button">
                      <button class="btn" type="submit" id="robotImageSelect">选择</button>
                    </div>
                  </div>
                  <!--配置管理→系统配置→场馆地图库-->
                  <div role="tabpanel" class="tab-pane venueMap scroll">
                    <div class="title">选择场馆地图</div>
                    <div class="picScroll-left venueSlide">
                      <a class="prev"></a>
                      <a class="next"></a>
                      <div class="bd">
                        <ul class="picList"></ul>
                      </div>
                    </div>
                    <div class="button">
                      <button class="btn" type="submit" id="mapSelect">选择</button>
                    </div>
                  </div>
                  <!--配置管理→系统配置→机器人最低电量-->
                  <div role="tabpanel" class="tab-pane electricLow" id="electricLow">
                    <form class="form-horizontal" role="form">
                      <div class="form-group">
                        <label for="" class="control-label">选择机器人最低电量</label>
                        <div class="dropdown">
                          <select class="selectpicker show-tick form-control pickEnergy" onchange= "changeEnergy()">
                            <option value="10">10%</option>
                            <option value="20">20%</option>
                            <option value="40">40%</option>
                          </select>
                        </div>
                      </div>
                    </form>
                  </div>
                </div>
              </div>
            </div>
            <!--配置管理→系统配置end-->
            <!--配置管理→业务配置begin-->
            <div role="tabpanel" class="tab-pane work tab2">
              <div class="tab workTab" id="workTab">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                  <li role="presentation" class="active">
                    <a href=".platePanel" aria-controls="platePanel" role="tab" data-toggle="tab">板块及展板配置</a>
                  </li>
                  <li role="presentation">
                    <a href=".robotName" aria-controls="robotName" role="tab" data-toggle="tab">机器人名称配置</a>
                  </li>
                  <li role="presentation">
                    <a href=".commentary" aria-controls="commentary" role="tab" data-toggle="tab">讲解词 、语言库</a>
                  </li>
                  <li role="presentation">
                    <a href=".emoji" aria-controls="emoji" role="tab" data-toggle="tab">表情库</a>
                  </li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                  <!--板块及展板配置begin-->
                  <div role="tabpanel" class="tab-pane platePanel active">
                    <div class="button" style="display: inline-block;width: 100%;">
                      <div style="float: left;">
                        <button class="btn active" type="button" id="platePz-btn">板块配置</button>
                        <button class="btn" type="button" id="panelPz-btn">展板配置</button>
                      </div>
                      <div style="float: right;" class="hideit" id="panelDelect_btn_parent">
                        <!-- <button class="btn active" type="button" id="panelSave-btn">保存</button> -->
                        <button class="btn panelDelectBtn" type="button" id="panelDelect-btn">批量删除</button>
                      </div>
                        
                        
                    </div>
                    <div class="tableDiv">
                      <!--板块配置-->
                      <table id="tablePlate" class="table table-bordered table-responsive tablePlate active" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>板块名称</td>
                            <td>颜色</td>
                            <td>编辑</td>
                            <td>删除</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <!--展板配置-->
                      <table id="tablePanel " class="table table-bordered table-responsive tablePanel" style="clear: both; display: none;">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>所在板块</td>
                            <td>展板位置</td>
                            <td>展板名称</td>
                            <td>讲解位置</td>
                            <!-- <td>编辑</td> -->
                            <td>删除</td>
                            <td>选择</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                    </div>
                  </div>
                  <!--板块及展板配置end-->
                  <!--机器人名称配置begin-->
                  <div role="tabpanel" class="tab-pane robotName">
                    <div class="tableDiv">
                      <table id="tableRobot" class="table table-bordered table-responsive tableRobot" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>机器人名字</td>
                            <td>主负责人</td>
                            <td>上线日期</td>
                            <td>维保时间</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                    </div>
                    <div class="button">
                      <button class="btn" type="button">新增机器人</button>
                    </div>
                  </div>
                  <!--机器人名称配置end-->
                  <!--讲解词、语言库配置begin-->
                  <div role="tabpanel" class="tab-pane commentary">
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tableCommentary" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>板块</td>
                            <td>展板</td>
                            <td>讲解词脚本名</td>
                            <td>上传文件</td>
                            <td></td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <!--讲解词、语言库配置end-->
                  <!--表情库配置begin-->
                  <div role="tabpanel" class="tab-pane emoji">
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tableEmoji" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>表情名称</td>
                            <td>上传文件</td>
                            <td></td>
                            <td>启用按钮</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <!--表情库配置end-->
                </div>
              </div>
            </div>
            <!--配置管理→业务配置end-->
            <!--配置管理→广告配置begin-->
            <div role="tabpanel" class="tab-pane ad tab2">
              <div class="tab adTab">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                  <li role="presentation" class="active">
                    <a href=".adPlaylist" aria-controls="home" role="tab" data-toggle="tab">广告播放列表</a>
                  </li>
                  <li role="presentation">
                    <a href=".adRules" aria-controls="profile" role="tab" data-toggle="tab">广告触发规则</a>
                  </li>
                  <li role="presentation">
                    <a href=".patrolRoute" aria-controls="messages" role="tab" data-toggle="tab">机器人巡逻线路</a>
                  </li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                  <!--配置管理→广告配置→广告播放列表begin-->
                  <div role="tabpanel" class="tab-pane adPlaylist active">
                    <div class="toolbox sel">
                      <button class="btn blue1" type="button" id="add_newAD">新增广告</button>
                      <input type="text" name="" id="seach_ad" class="inp" placeholder="广告搜索" onblur="searchADS(this)" value="" />
                    </div>
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tableADList" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>广告名称</td>
                            <td>广告时长</td>
                            <td>是否启用</td>
                            <td colspan="4" >操作</td>
                            <td>删除</td>
                            <td>全选</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="button">
                        <button class="btn btn-default" type="submit" id="deleteAD_btn" >删除</button>
                      </div>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <!--配置管理→广告配置→广告播放列表end-->
                  <!--配置管理→广告配置→广告触发规则begin-->
                  <div role="tabpanel" class="tab-pane adRules">
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tableADRules" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>规则名称</td>
                            <td>播放时长</td>
                            <td>是否启用</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <!--配置管理→广告配置→广告触发规则end-->
                  <!--配置管理→广告配置→机器人巡逻路线begin-->
                  <div role="tabpanel" class="tab-pane patrolRoute">
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tablePatrolRoute" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>线路名称</td>
                            <td>途径点位</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <!--配置管理→广告配置→机器人巡逻路线end-->
                </div>
              </div>
            </div>
            <!--配置管理→广告配置end-->
            <!--配置管理→日志、维修、告警配置begin-->
            <div role="tabpanel" class="tab-pane other tab2">
              <div class="tab otherTab">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                  <li role="presentation" class="active">
                    <a href=".servers" aria-controls="home" role="tab" data-toggle="tab">日志服务器配置</a>
                  </li>
                  <li role="presentation">
                    <a href=".alarmLevel" aria-controls="profile" role="tab" data-toggle="tab">告警信息级别配置</a>
                  </li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                  <div role="tabpanel" class="tab-pane servers active">
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tableServers" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>日志服务器序号</td>
                            <td>本地或IP</td>
                            <td>启用按钮</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                  <div role="tabpanel" class="tab-pane alarmLevel">
                    <div class="tableDiv">
                      <table class="table table-bordered table-responsive tableAlarmLevel" style="clear: both">
                        <thead>
                          <tr>
                            <td>序号</td>
                            <td>告警时间</td>
                            <td>初始等级</td>
                            <td>反应时间要求</td>
                            <td>编辑</td>
                            <td>删除</td>
                            <td>全选</td>
                          </tr>
                        </thead>
                        <tbody></tbody>
                      </table>
                      <div class="button left">
                        <button class="btn" type="button" id="addEvent">新增</button>
                        <button class="btn" type="button" id="deleteMoreEvent" style="margin-left: 20px;background-color: white;color: #3497DB;border-radius: 5px;border: #3497DB 1px solid;">删除</button>
                        <button class="btn" type="button" id="saveMoreEvent" style="margin-left: 20px;background-color: white;color: #3497DB;border-radius: 5px;border: #3497DB 1px solid;">保存</button>
                      </div>
                      <div class="page">
                        <ul class="pagination"></ul>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!--配置管理→日志、维修、告警配置end-->
          </div>
        </div>
      </div>
      <!--权限管理begin-->
      <div role="tabpanel" class="permission tab-pane">
        <div class="choose choosePerson">
          <form class="form-horizontal" role="form">
            <div class="form-group">
              <div for="" class="control-label">选择人员</div>
              <select id="pickAdmin-qx" class="selectpicker show-tick form-control pickAdmin">
                <option>张丽丽</option>
                <option>王某某</option>
                <option>丁点点</option>
              </select>
            </div>
          </form>
        </div>
        <div class="permissDiv" style="display: none;">
          <div class="permissName"></div>
          <div class="tableDiv table-responsive">
            <table class="table table-bordered table-striped table-quanxian">
              <thead>
                <tr>
                  <td>管理机器人</td>
                  <td>权限</td>
                  <td>编辑</td>
                  <td>删除</td>
                  <td>选择</td>
                </tr>
              </thead>
              <!--待处理：配置管理的tbody结构，js加载方法需要根据数据表格式来重构-->
              <tbody>
                <tr>
                  <td>2</td>
                  <td>
                    <span>配置管理员</span>
                    <span>日志审计员</span>
                  </td>
                  <td class="edit"></td>
                  <td class="delete"></td>
                  <td>
                    <input type="checkbox" name="" id="" value="" />
                  </td>
                </tr>
                <tr>
                  <td>3</td>
                  <td>
                    <span>配置管理员</span>
                    <span>日志审计员</span>
                  </td>
                  <td class="edit"></td>
                  <td class="delete"></td>
                  <td>
                    <input type="checkbox" name="" id="" value="" />
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="permissBtn">
          	<button class="btn btn-blue add" type="submit">添加</button>
          	<button class="btn btn-gray02 delete" type="submit">删除</button>
          </div>
          <div id="permissEdit" style="display: none;">
            <div class="choose col-lg-12 col-sm-12">
              <form class="form-horizontal" role="form">
                <div class="form-group">
                  <label for="" class="control-label">请选择机器人</label>
                  <div class="sel permissEditRobot">
                    <select class="selectpicker show-tick form-control pickRobot">
                      <option>机器人001A</option>
                      <option>机器人002B</option>
                      <option>机器人003C</option>
                    </select>
                  </div>
                </div>
              </form>
            </div>
            <div class="check control-label" style="position: relative;top: 20px;left:12px; ">
              <label>配置权限</label>
              <div class="checkbox-bianji">
                <label class="checkbox-inline">
                  <input type="checkbox" id="inlineCheckbox1" value="1">配置
                </label>
                <label class="checkbox-inline">
                  <input type="checkbox" id="inlineCheckbox2" value="2">展厅讲解员
                </label>
                <label class="checkbox-inline">
                  <input type="checkbox" id="inlineCheckbox3" value="3">日志审计员
                </label> 
              </div>
              
              <button class="btn btn-default submit-bianji" type="submit">
                <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
              </button>
            </div>
          </div>
        </div>
      </div>
      <!--权限管理end-->
      <!--预约管理begin-->
      <div role="tabpanel" class="tab-pane appointment">
        <!--预约管理展示表格-->
        <div class="table-responsive showTable">
          <div class="title">
            <div>机器人预约时间表</div>
            <button class="btn btn-default edit" type="submit">编辑</button>
            <button class="btn btn-default new" type="submit">新增</button>
          </div>
          <div class="sel">
            <div class="dropdown">
              <select class="selectpicker show-tick form-control pickRobot">
                <!-- <option>AAA区</option>
                <option>BBB区</option>
                <option>CCC区</option> -->
              </select>
            </div>
            <div class="dropdown">
              <select class="selectpicker show-tick form-control pickBookingPerson">
                <!-- <option>闪电侠</option>
                <option>绿箭侠</option>
                <option>钢铁侠</option> -->
              </select>
            </div>
            <input type="text" value="选择开始时间" class="datetimepicker now start-time">
            <input type="text" value="选择结束时间" class="datetimepicker now end-time">
            <div class="dropdown">
              <select id="" class="selectpicker show-tick form-control pickState">
                <option value="">全部</option>
                <option value="1">接待中</option>
                <option value="2">已接待</option>
                <option value="3">迟到</option>
                <option value="4">未接到</option>
                <option value="5">取消预约</option>
              </select>
            </div>
            <div class="button">
              <button class="btn btn-default" type="submit">查询</button>
            </div>
          </div>
          <div class="table">
            <table class="table table-bordered table-striped tableAppointmentShow">
              <thead>
                <tr>
                  <th>序号</th>
                  <th>机器人名称</th>
                  <th>预约时间段</th>
                  <th>预约迎宾时间</th>
                  <th>预约人</th>
                  <th>联系方式</th>
                  <th>状态</th>
                </tr>
              </thead>
              <tbody></tbody>
            </table>
          </div>
          <div class="page">
            <ul class="pagination"></ul>
          </div>
        </div>
        <!--预约管理编辑表格-->
        <div class="table-responsive editTable" style="display: none;">
          <div class="title">
            <div>机器人预约时间表</div>
            <button class="btn btn-default editsave" type="submit">保存</button>
            <button class="btn btn-default cancel" type="submit">取消</button>
          </div>
          <div class="tableDiv">
            <table class="table table-bordered tableAppointmentEdit">
              <thead>
                <tr>
                  <th>序号</th>
                  <th>机器人名称</th>
                  <th>预约时间段</th>
                  <th>预约迎宾时间</th>
                  <th>预约人</th>
                  <th>联系方式</th>
                  <th>删除</th>
                  <th>选择</th>
                </tr>
              </thead>
              <tbody></tbody>
            </table>
            <div class="button">
            	<button class="btn btn-default" type="submit">删除</button>
            </div>
          </div>
          <div class="page">
            <ul class="pagination" id="pagination3"></ul>
          </div>
        </div>
      </div>
      <!--预约管理end-->
      <!--统计分析begin
      https://www.bbsmax.com/A/WpdKDo01zV/
      http://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts  实例
      -->
      <div role="tabpanel" class="tab-pane count">统计分析</div>
      <!--统计分析end-->
    </div>
    
    
    <!--弹窗begin-->
    <!--机器人添加成功弹窗begin-->
    <div class="modal fade robotSucceedModal" tabindex="-1" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="title">添加成功</div>
          </div>
          <div class="modal-footer"></div>
        </div>
      </div>
    </div>
    <!--机器人添加成功弹窗end-->
    <!--实时监控，点击显示更多按钮，跳出弹窗begin-->
    <div class="modal fade controlMoreModal" tabindex="-1" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="tableDiv">
              <table class="table table-striped controlModalTable table-bordered">
                <thead>
                  <tr>
                    <td>序号</td>
                    <td>执行命令</td>
                    <td>命令</td>
                    <td>位置(区域、展板)</td>
                    <td>结果</td>
                    <td>返回值</td>
                  </tr>
                </thead>
                <tbody></tbody>
              </table>
              <div class="page">
                <ul class="pagination"></ul>
              </div>
            </div>
          </div>
          <div class="modal-footer"></div>
        </div>
      </div>
    </div>
    <!--实时监控，点击显示更多按钮，跳出弹窗end-->
    <!--权限管理，新增按钮begin-->
    <div class="modal fade permissionModal" tabindex="-1" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="form-row">
              <div class="form-group dropdown model-pickRobot">
                <select class="selectpicker show-tick form-control pickRobot">
                  <option>机器人001A111</option>
                  <option>机器人002A</option>
                  <option>机器人003A</option>
                </select>
              </div>
            </div>
            <div class="title">配置权限</div>
            <div class="check">
              <div>
                <input type="checkbox" name="" id="" value="" />
                <label for="">配置管理员</label>
              </div>
              <div>
                <input type="checkbox" name="" id="" value="" />
                <label for="">展厅讲解员</label>
              </div>
              <div>
                <input type="checkbox" name="" id="" value="" />
                <label for="">日志审计员</label>
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn cancel" data-dismiss="modal">取消</button>
            <button type="button" class="btn confirm role-btn">确定</button>
          </div>
        </div>
      </div>
    </div>
    <!--权限管理，新增按钮end-->
    <!--预约管理→机器人预约时间表→展示界面，新增按钮点击弹出begin-->
    <div class="modal fade appointmentModal" tabindex="-1" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="form-row">
              <div class="form-group dropdown">
                <select class="selectpicker show-tick form-control pickRobot">
                  <option>机器人001A</option>
                  <option>机器人002A</option>
                  <option>机器人003A</option>
                </select>
              </div>
              <div class="form-group">
              	<input type="text" value="选择开始时间" class="datetimepicker now" id="start-yuyue">
              </div>
              <div class="form-group text" id="">
                <input type="" name="" id="yuyue-Pnum" value="" placeholder="预约人数" />
              </div>
              <div class="form-group dropdown">
                <select class="selectpicker show-tick form-control pickDepartment" multiple>
                  <option>机器人001A</option>
                  <option>机器人002A</option>
                  <option>机器人003A</option>
                </select>
              </div>
            </div>
            <div class="title">摘要</div>
            <textarea id="zhaiyao" name="" rows="" cols=""></textarea>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn cancel" data-dismiss="modal">取消</button>
            <button type="button" class="btn confirm">确定</button>
          </div>
        </div>
      </div>
    </div>
    <!-- 广告新增motal -->
    <div class="modal fade ADModal" tabindex="-1" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div> 
          <div class="modal-body">
            <div class="form-row">  
              <div class="form-group text" id="">
                <input type="" name="" id="ad-name" value="" placeholder="广告名称" />
              </div>
              <div class="form-group text" id="">
                <input type="" name="" id="ad-duration" value="" placeholder="广告时长" />
              </div>
              <div class="form-group" id="">
                  <div id="ad_btn" class="upload_ad" style="position: relative;line-height: 36px;text-align: center;">
                    <span>上传文件</span>
                    <input type="file" name="uploadADFile" onchange="getADFile(this)" style="opacity: 0;width: 100%;height: 100%;position: absolute;left: 0;top: 0;" /></div> 
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn cancel" data-dismiss="modal">取消</button>
            <button type="button" class="btn confirm-ad">确定</button>
          </div>

        </div>  
      </div>
    </div>


    <!-- 告警信息级别配置新增motal -->
    <div class="modal fade msgModal" tabindex="-1" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div> 
          <div class="modal-body">
            <div class="form-row">  
              <div class="form-group text" id="">
                <input type="" name="" id="msg-name" value="" placeholder="告警名称" />
              </div>
              <div class="form-group text" id="">
                <input type="" name="" id="msg_level" value="" placeholder="告警等级" />
              </div>
              <div class="form-group" id="">
                <input type="" name="" id="msg_time" value="" placeholder="反应时间要求" />
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn cancel" data-dismiss="modal">取消</button>
            <button type="button" class="btn confirm-msg">确定</button>
          </div>

        </div>  
      </div>
    </div>

    <!-- 地图图片 -->
    <div class="modal fade mapModal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
            </div> 
            <div class="modal-body">
              <div class="form-row" style="position: relative;">  
                 <img src="img/floor2.jpg" alt="" style="width: 100%;">
                 <img src="img/u88.png" alt="机器人" id="robot_img"> 
              </div>
              
            </div>
            <div class="modal-footer">
              <div class="form-row" style="position: relative;width: 100%;">
                <div id="points_robot" style="position: absolute;right: 390px;width: 500px;text-align: left;"></div>
              </div>
              <button type="button" class="btn cancel" data-dismiss="modal">取消</button>
              <button type="button" class="btn confirm-ad" data-dismiss="modal">确定</button>
            </div>
  
          </div>  
        </div>
      </div>

    <!--预约管理→机器人预约时间表→展示界面，新增按钮点击弹出end-->
    <!--配置管理→业务配置→机器人名称配置→点击新增机器人按钮弹出begin-->
    <div class="modal fade robotNameModal" tabindex="-1" role="dialog" id="robotNameModal">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <div class="title">新增机器人</div>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="form-group text">
              <div>机器人名字</div>
              <input type="" name="" id="robotName_add" value="" />
            </div>
            <div class="form-group text">
              <div>主负责人</div>
              <input type="" name="" id="robotPerson_add" value="" />
            </div>
            <div class="form-group">
              <div>上线日期</div>
              <input type="text" value="选择开始时间" class="datetimepickerDay now" id="robotData_add">
            </div>
            <div class="form-group">
              <div>维保日期</div>
              <input type="text" value="选择开始时间" class="datetimepickerDay" id="robotWei_add">
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn cancel" data-dismiss="modal">取消</button>
            <button type="button" class="btn confirm">确定</button>
          </div>
        </div>
      </div>
    </div>
    <!--配置管理→业务配置→机器人名称配置→点击新增机器人按钮弹出end-->
    <!--弹窗end-->
    
    
    <script src="dist/jquery-2.2.4.min.js"></script>
    <script src="dist/bootstrap-3.3.7/js/bootstrap.js"></script>
    <script src="dist/DataTables-1.10.16/dataTables.js"></script>
    <script src="dist/DataTables-1.10.16/DataTables-1.10.16/js/dataTables.bootstrap.js"></script>
    <script src="dist/DateTimePicker/bootstrap-datetimepicker.js"></script>
    <script src="dist/DateTimePicker/bootstrap-datetimepicker.zh-CN.js"></script>
    <script src="dist/bootstrap-select-1.12.4/js/bootstrap-select.js"></script>
    <script src="dist/jqPaginator-1.2.1/jqPaginator.js"></script>
    <script src="dist/jquery.SuperSlide.2.1.1.js"></script>
    <!--<script src="dist/Swiper/js/swiper.js"></script>-->
    <script src="dist/x-editable/bootstrap-editable.js"></script>
    <script src="https://cdn.bootcss.com/video.js/7.0.3/video.min.js"></script>

    <!--这两句不需要  -->
    <!-- <script src="dist/mock/mock-min.js"></script> 
    <script src="json/index-json.js"></script> -->

    <script src="js/api.js"></script>
    <script src="js/basic.js"></script>
    <script src="js/index.js"></script>
  </body>

</html>